{extend name="public:base" /}
{block name="main"}

<style>
    .win{

        width:1020px;height:auto;border:1px solid #ccc;margin:20px auto;position:relative;
        overflow: hidden;
    }
    .title{
        width:100%;height:30px;background:#eee;position: relative;
    }
    .title a{
        /*padding:0 30px;*/width:8%;height:100%;float:left;text-align: center;line-height: 30px;font-size: 15px;color:#009797;text-decoration: none;position: relative;z-index: 1;
    }
    .title .float{
        width:20%;height:100%;background: #009797;position: absolute;
    }
    .box{
        width:100%;height:auto;position: relative;
    }

    .rightB{
        width:50%;height:100%;font-size: 20px;color:#fff;background: rgba(255,255,255,0.01);position: absolute;right:0;top:0;line-height:70px;text-align: center;cursor: url("/static/shop/img/cursor_right.cur"), auto;display: none;
    }
    .leftB{
        width:50%;height:100%;font-size: 20px;color:#fff;background: rgba(255,255,255,0.01);position: absolute;left:0;top:0;line-height:70px;text-align: center;cursor: url("/static/shop/img/cursor_left.cur"), auto;display: none;
    }

</style>

<script>
    $(function(){
        var pic = new Array();
        var pictitle = new Array();

        {volist name="list" id="vo" key = 'kkk'}
            pic[{$kkk}]= "/{$vo.path}";
            pictitle[{$kkk}]="{$vo.description}";
        {/volist}

        var win=$(".win");
        var links=$(".title a");
        var page_num=$("#page_num").text();


        $('#pichref').attr('src', pic[1]);
        $('#pictitle').text(pictitle[1]);

        var divs=$(".box div");
        var num1=0;  //ǰݵ±
        var num2=0;
        var len={:count($list)};
        win.hover(function(){
            $(".leftB,.rightB").css("display","block");
        },function(){
            $(".leftB,.rightB").css("display","none");
        });
        $(".leftB").click(function(){

            var num1=$("#page_num").text();
            num1--;
            if(num1<1){
                num1=len;
            }
            $("#page_num").text(num1);
            var nr="<img src="+pic[num1]+"/>";
            $('#pichref').attr('src', pic[num1]);
            $('#pictitle').text(pictitle[num1]);



        });
        $(".rightB").click(function(){
            var num1=$("#page_num").text();
            num1++;
            if(num1>len){
                num1=1;
            }
            $("#page_num").text(num1);
            var nr="<img src="+pic[num1]+"/>";
            $('#pichref').attr('src', pic[num1]);
            $('#pictitle').text(pictitle[num1]);

        });
    })

</script>

    <div class="ShareAnyContainer">
        当前位置：<a href="{:url('shop/index/index')}" title="首页">首页</a>&nbsp;&nbsp;/&nbsp;&nbsp;<a
            href="{:url('shop/live/group')}" title="创作直播">创作直播</a>
    </div>
    <div class="ShareAnySeparate"></div>
    <div class="ShareAnyContainer">
        <div style="text-align: center; font-size: 20px; font-weight: bold;">{$info.title}</div>
        <table style="width:1190px;margin:auto">
            <tbody><tr>
                <td>
                    <div class="win">
                        <div class="box">



                            <img id="pichref" width="100%" height="auto" src="">


                            <span id="page_num" style="color:red;font-size:40px;font-family: Georgia, 'Monotype Corsiva', Arial, sans-serif;font-style: italic;">0</span>/<span>{:count($list)}</span>&nbsp;&nbsp;<span id="pictitle"></span>
                        </div>


                        <div class="leftB" style="display: none;"></div>
                        <div class="rightB" style="display: none;"></div>

                    </div>

                </td>
                <td style="width:150px;vertical-align:top;line-height:25px;padding-top:40px;padding-left:20px;">
                    <div>{$info.content}</div>
                </td>

            </tr>
            </tbody></table>

    </div>
    <div class="ShareAnySeparate"></div>
    <div class="ShareAnyContainer">
        <div class="line"></div>
    </div>
    <div class="ShareAnySeparate"></div>
    <div class="ShareAnyContainer" style="text-align: center;">

    </div>
{/block}
